import SwiftUI struct MapAxes: View { let mapSize: CGSize let lineWidth: CGFloat let evolution: Stage let stages: [CGFloat] let stageHeight = CGFloat(100.0) let padding = CGFloat(5.0) var body: some View { ZStack(alignment: .topLeading) { // Axis Lines Path { path in path.move(to: CGPoint(x: 0, y: 0)) path.addLine(to: CGPoint(x: 0, y: mapSize.height)) path.addLine(to: CGPoint(x: mapSize.width, y: mapSize.height)) path.move(to: CGPoint(x: mapSize.width, y: mapSize.height)) path.closeSubpath() }.stroke(Color.map.axisColor, lineWidth: lineWidth * 2) // Y Labels Text("Visible").font(.theme.axisLabel).foregroundColor(.map.labelColor).rotationEffect(Angle(degrees: -90.0)) .offset(CGSize(width: -35.0, height: 0.0)) Text("Invisible").font(.theme.axisLabel).foregroundColor(.map.labelColor).rotationEffect(Angle(degrees: -90.0)) .offset(CGSize(width: -40.0, height: mapSize.height - 20)) // X Labels Text("Uncharted") .font(.theme.axisLabel) .foregroundColor(.map.labelColor) .frame(width: mapSize.width / 4, height: stageHeight / 2.0, alignment: .topLeading) .offset(CGSize(width: 0.0, height: -stageHeight / 4.0)) Text("Industrialised") .font(.theme.axisLabel) .foregroundColor(.map.labelColor) .frame(width: mapSize.width / 4, height: stageHeight / 2.0, alignment: .topLeading) .offset(CGSize(width: mapSize.width - 100.0, height: -stageHeight / 4.0)) Text(evolution.i) .font(.theme.axisLabel) .foregroundColor(.map.labelColor) .frame(width: w(stages[0]), height: stageHeight, alignment: .topLeading) .offset(CGSize(width: 0.0, height: mapSize.height + padding)) Text(evolution.ii) .font(.theme.axisLabel) .foregroundColor(.map.labelColor) .frame(width: w(stages[1]) - w(stages[0]), height: stageHeight, alignment: .topLeading) .offset(CGSize(width: w(stages[0]), height: mapSize.height + padding)) Text(evolution.iii) .font(.theme.axisLabel) .foregroundColor(.map.labelColor) .frame(width: w(stages[2]) - w(stages[1]), height: stageHeight, alignment: .topLeading) .offset(CGSize(width: w(stages[1]), height: mapSize.height + padding)) Text(evolution.iv) .font(.theme.axisLabel) .foregroundColor(.map.labelColor) .frame(width: mapSize.width - w(stages[2]), height: stageHeight, alignment: .topLeading) .offset(CGSize(width: w(stages[2]), height: mapSize.height + padding)) } } func w(_ dimension: CGFloat) -> CGFloat { max(0.0, min(mapSize.width, dimension * mapSize.width / 100.0)) } } struct MapAxes_Previews: PreviewProvider { static var previews: some View { MapAxes( mapSize: CGSize(width: 200.0, height: 200.0), lineWidth: CGFloat(1.0), evolution: Stage.stages(.general), stages: [25.0, 50.0, 75.0] ).padding(50.0) } }